
/* Content */
.drop-container {
    /*width: 400px;*/
}

.handle-header {
    margin: 0px 2px 13px 2px;
    border-bottom: 1px solid #eee;
    padding-bottom:6px;
}

.img-container,
.img-preview {
    width: 100%;
    text-align: center;
    background-color: #f7f7f7;
}

.img-container {
   height:423px;

}

.img-container > img {
    max-width: 100%;
}

/*.docs-preview {
    margin-right: -16px;
}*/

.img-preview {
    float: left;
    overflow: hidden;
    margin-right: 8px;
    margin-bottom: 0px;
}

    .img-preview > img {
        max-width: 100%;
    }

.preview-lg {
    width: 255px;
    height: 143px;
}

.preview-md {
    width: 128px;
    height: 72px;
}

.preview-sm {
    width: 72px;
    height: 40px;
}

.preview-xs {
    width: 40px;
    height: 24px;
    margin-right: 0;
}

.docs-toggles > .btn,
.docs-toggles > .btn-group,
.docs-toggles > .dropdown {
    margin-bottom: 8px;
}

.docs-tooltip {
    display: block;
}

@media (max-width: 400px) {
    .btn-group-crop {
        margin-right: -16px !important;
    }

        .btn-group-crop > .btn {
            padding-right: 8px;
            padding-left: 8px;
        }
}

.docs-aspect-ratios,
.docs-view-modes {
    width: 100%;
}

    .docs-aspect-ratios > .btn {
        width: 20%;
    }

    .docs-view-modes > .btn {
        width: 25%;
    }

.docs-options .dropdown-menu {
    width: 100%;
}

    .docs-options .dropdown-menu > li {
        padding: 4px 16px;
    }

        .docs-options .dropdown-menu > li:hover {
            background-color: #f7f7f7;
        }

        .docs-options .dropdown-menu > li > label {
            display: block;
            margin-bottom: 0;
            cursor: pointer;
        }

.docs-cropped .modal-body {
    text-align: center;
}

    .docs-cropped .modal-body > img,
    .docs-cropped .modal-body > canvas {
        max-width: 100%;
    }

.btn-reset,
.btn-addFile,
.btn-crop{
    background-color: #1AB394;
    padding: 4px 5px;
    font-size: 20px;
}

.btn-lg,
.btn-group-lg > .btn{
  font-size: 18px;
  line-height: 1.33;
  border-radius: 6px;
}

.btn-sm,
.btn-group-sm > .btn {
  padding: 5px 10px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}
.btn-xs,
.btn-group-xs > .btn {
  padding: 1px 5px;
  font-size: 12px;
  line-height: 1.5;
  border-radius: 3px;
}
.btn-block {
  display: block;
  width: 100%;
}
.btn-group.btn-block .btn{
    width: 60px;
    background:none;
    color:#ffffff;
    font-size:15px;
}

.btn-block + .btn-block {
  margin-top: 5px;
}

.btn-default {
  color: #333333;
  border-color: #cccccc;
}
.btn-default:hover,
.btn-default:focus,
.btn-default.focus,
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
  background-color: rgba(0,0,0,0.5) !important;
 /*  border-color: #adadad;*/
}
.btn-default:active,
.btn-default.active,
.open > .dropdown-toggle.btn-default {
  background-image: none;
}
.upload-head-img{
  width:500px;
    float:left;
  }
  .head-img-opration{
    width:500px;
    box-sizing: border-box;
    position:absolute;
    z-index:10;
    bottom:0px;
    left:0px;
  }
  .img-preview-block{
    overflow:hidden;

  }
  .opation-block{
    overflow:hidden;
  }
  .docs-preview{
    overflow:hidden;
  }
  .ratio-select{
    width:100%;
  }
  .select-img-headle{
        width: 100%;
        box-sizing: border-box
  }
  .select-img-headle .handle-header{
      margin-top:16px;
  }

  h3{
    line-height: 1;
  }
  .opation-block .handle-header{
    padding-top:15px;
  }
.btn-group+.btn-group{
    margin-left:0px;
  }
.btn-toolbar > .btn-grou.btn-block{
   margin-left:0px !important;
}
.btn-group:first-child{

}
.cropper-wrap-box{
  /*margin:35px 0px 35px 0px;*/
/*  top:35px;
  bottom:35px;
  left:0px; 
  right:0px;*/
}
#masterContent{
    position: relative;
    overflow: hidden;
}
.btn-group-background{
  background-color:rgba(0,0,0,0.7);
}
.docs-tooltip [class^="icon-"]{
  margin-right:0px;
}
.opation-block .btn-toolbar{
  margin-top:0px ;
  margin-bottom:0px;
}
.btn-group.btn-block .btn[title='Reset']{
  width:80px;
}